<script src="resource/js/rem.js"></script>
<link rel="stylesheet" type="text/css" href="resource/css/myslider.css">
<script src="resource/js/main.js?v=0.01"></script>
<style>
    .footer-home{display: none;}
</style>
<header>
    <a href="javascript:history.back(-2);" style="color: #fff; ">
        <i class="iconfont icon-xialalan-copy"></i>
    </a>
    <span>预定酒店</span>
</header>
<div class="container margin_bot">
    <div class="detail">
        <div class="de_title"><?php echo $output['hotel_name']; ?>
            <a class="fr font_s"  id="font_s">
                <span class="connect ">房型详情</span>
                <span class="rotate iconfont icon-xialalan-copy"></span>
            </a>
        </div>
            <span class="hotel_detail">
                入住：<?php echo $output['hotel_time']['startdate']?>  离店：<?php echo $output['hotel_time']['enddate'] ?>  <?php echo $output['numdate']; ?>晚
            </span><br/>
            <span class="hotel_detail_1">
                <?php echo $output['spec_info']['parent_id']>0?$output['pt_spec_info']['spec_name']:$output['spec_info']['spec_name']; ?>  <?php echo $output['spec_info']['parent_id']>0?$output['spec_info']['spec_name'].' '.$output['spec_info']['label']:$output['spec_info']['label']; ?>
            </span>
    </div>
    <ul class="ul_2">
        <form class="visitors" id="order">
        <li class="li_2"><span>房间数</span><span class="room">1间</span>
            <a ><i id="new_room_id" class="rotate iconfont icon-xialalan fr"></i></a>
            <ul class="pop-list" style="display: none">
               <?php  for($i=1;$i<=$output['sum_on_num'];$i++){ ?>
                <li class="flex"><input id="check<?php  echo $i?>" class="radio_class" type="radio" value="<?php echo $i; ?>" name="room_num"/><label for="check<?php  echo $i?>"></label><?php echo $i;  ?>间</li>
               <?php } ?>
            </ul>

                <input type="hidden" name="form_submit" value="ok">
                <input type="hidden" name="hotel_id" value="<?php echo $output['spec_info']['goods_id']; ?>">
                <input type="hidden" name="spec_id" value="<?php echo $output['spec_info']['spec_id']; ?>">
                <input type="hidden" name="num" value="1">


        <li class="li_2"><span>入住人</span><input class="info_put" type="text" name="name" placeholder="请输入姓名" /><a class="add fr" href="javascript:;" id="icon-jia">+</a></li>
        <li class="li_2"><span>手机号</span><input class="info_put" type="text" name="phone" placeholder="请输入手机号" /></li>
        </form>
    </ul>
    <span class="action">提示语：玩转六盘水电子消费券密码一经验证即代表消费成功，不可申请退款服务,请您合理安排验证时间。</span>
</div>
<div class="pay">
    <div class="pay_foot">支付
        <span class="pay_color"><i class="iconfont icon-renminbi"></i><?php echo $output['total_price']; ?></span><a id="unfold" class="color_blue" href="javascript:;" >明细<i id="iconi" class="iconfont icon-xialalan"></i></a>
    </div>
    <a class="pay_btn" id="pay_btn">支付</a>
</div>
</div>
<div class="mask" >

    <div class="pop_item pop_div">
        <div class="de_title ">
            <p class="ul_line detail">费用明细</p>
            <div class="fr"><?php echo $output['numdate']; ?>晚，<span id="all_num">1</span>间共<span class="pay_color"><i class="iconfont icon-renminbi"></i><?php echo $output['total_price']; ?></span></div>
        </div>
        <ul class="pop-list">
            <?php foreach($output['numdate_info'] as $value){ ?>
            <li class="flex "><?php echo $value; ?> 房费 无早<span class="fr">1x<?php echo $output['spec_info']['price']; ?></span></li>
            <?php } ?>
        </ul>
    </div>

</div>
<div id="sel" style="display: none;position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color:#fff;z-index: 100003"></div>
<div class="mask_1" style="display: none;">
    <div class="payway" onclick=" event.stopPropagation();">
        <p>支付选择：</p>
        <ul>
            <li>
                <a  class="pay_type_button" >
                    <label for="radio1">
                        <i class="zf zfb"></i>
                        支付宝支付
                        <input type="radio" name="zf" id="radio1" value="ali" class="radio-btn"/>
                        <i class="radio"></i>
                    </label>
                </a>
            </li>
            <li>
                  <a  class="pay_type_button" >
                      <label for="radio2">
                          <i class="zf wx"></i>
                          微信支付
                          <input type="radio" name="zf" id="radio2" class="radio-btn" value="wx"/>
                          <i class="radio"></i>
                      </label>
                  </a>
              </li>
        </ul>
        <input type="hidden" name="order_code" value="">
        <input type="hidden" name="pay_type" value="">
        <a  class="submit-btn">确认提交支付</a>
    </div>


</div>
<div class="holl" style="z-index: 1005;">
    <!-- 房型详情 -->
</div>
<link rel="stylesheet" href="resource/css/new_payway.css?v=0.13" />
<script src="resource/js/jquery.mySlider.js"></script>
<script>
    var unit_cos= "<?php echo $output['total_price']; ?>";//一间房间的单价
    var day = "<?php echo $output['numdate']; ?>";//入驻的天数
    //选择房间数量计算价格
    $("[name='room_num']").click(function(){
        var on_num = $(this).val();
        $(".room").text(on_num+'间');
        $('#all_num').text(on_num);
        $("[name='num']").val(on_num);
        var all_price =on_num*unit_cos;
        $(".pay_color").text(all_price.toFixed(2));
    });
    //是否正在支付
    var paying = false;
    var orderForm = $('#order');
    //提交支付
    $("#pay_btn").click(function(){
        if ($.trim(orderForm.find('input[name="name"]').val()) == '') {
            popAlert('姓名不能为空');
            //return;
        } else if (!/^1\d{10}$/.test(orderForm.find('input[name="phone"]').val())) {
            popAlert('手机号不正确');
            //return;
        } else {
            $('.mask_1').show();
        }
    });

    //打开选择游客信息
    function openSel() {
        $('#sel').load('index.php?act=hotel&op=sel_info').fadeIn();
    }
    //关闭选择游客信息
    function closeSel() {
        $('#sel').fadeOut();
    }
    //打开编辑游客信息
    function openEdit(id) {
        $('#edit').load('index.php?act=hotel&op=update_info&id=' + id).fadeIn();
    }
    //关闭编辑游客信息
    function closeEdit() {
        $('#edit').fadeOut();
    }
    //选择游客信息
    $('#icon-jia').click(function () {
       // alert(11);
        openSel();
    });
    $('.mask_1').click(function(){
        paying = false;
        $('.mask_1').hide();
    });
    $('.pay_type_button').click(function(){
        var pay_type= $(this).find('input').val();
        $("[name='pay_type']").val(pay_type);
    });
    $('.submit-btn').click(function(){

        var order_code = $("[name='order_code']").val();
        if($("[name='pay_type']").val()==''){
            alert('请选择您的支付方式！');
            return;
        }
        if(paying) {
            $('.mask_1').hide();
            popAlert('您已提交过订单,请勿重复提交');
            return false;
        }
        if($("[name='pay_type']").val() == 'ali'){
            //支付宝支付
            alipay();
        }
        if($("[name='pay_type']").val() == 'wx'){
            //微信支付..
            wxpay();
        }
    });
    function alipay(){
        $.ajax({
            url: 'index.php?act=order&op=hotel_place&t=ali',
            type: 'POST',
            data: orderForm.serialize(),
            dataType: 'json',
            async: false,
            success: function (data, textStatus, jqXHR) {
                if (data.errcode == 0) {
                    if (data.errmsg == false) {
                        $('.mask_1').hide();
                        popAlert('支付错误', function () {
                            location.href = 'index.php?act=member&op=order';
                        });
                    } else {
                        paying = true;
                        window.app && window.app.AppPay(data.errmsg);
                        window.webkit && window.webkit.messageHandlers.AppPay.postMessage(data.errmsg);
                    }
                } else {
                    $('.mask_1').hide();
                    popAlert(data.errmsg, function () {
                        paying = false;
                    });
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                paying = false;
            }
        });
    }

    function wxpay(){
        $.ajax({
            url: 'index.php?act=order&op=hotel_place&t=wx',
            type: 'POST',
            data: orderForm.serialize(),
            dataType: 'json',
            async: false,
            success: function (data, textStatus, jqXHR) {
                if (data.errcode == 0) {
                    if (data.errmsg == false) {
                        $('.mask_1').hide();
                        popAlert('支付错误', function () {
                            location.href = 'index.php?act=member&op=order';
                        });
                    } else {
                        paying = true;
                        window.app && window.app.AppWxPay(JSON.stringify(data.errmsg));
                        window.webkit && window.webkit.messageHandlers.AppWxPay.postMessage(JSON.stringify(data.errmsg));
                    }
                } else {
                    $('.mask_1').hide();
                    popAlert(data.errmsg, function () {
                        paying = false;
                    });
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                paying = false;
            }
        });
    }

    //点击查看房型详情
    $(function(){
        var dd =false;
        $("#font_s").click(function(){
            var spec_id = "<?php echo $output['spec_info']['parent_id']>0?$output['pt_spec_info']['spec_id']:$output['spec_info']['spec_id']; ?>";
            if(dd){
                $(".holl").show();
                return;
            }
            $.get('index.php?act=hotel&op=get_room',{spec_id:spec_id,type:'order'},function(data){
                dd = true;
                $(".holl").append(data);
                $(".holl").show();
            });
        });
        $('.holl').click(function(){
            //$(".holl").empty();
            $(".holl").hide();
        });
       var j=1;
        $("#new_room_id").click(function () {
            $(this).parent().next(".pop-list").slideToggle();
            $(this).css("transform","rotate("+j*180+"deg)");
           ++j;
        });
    });
    //明细

        $("#unfold").click(function () {
        stop();
                    $(".mask").toggle();
                    $(".pop_item").slideToggle();
                    $(".mask").click(function(){

                                $(".mask").css("display","none");
                                $(".pop_item").css("display","none");
                            });
        });
</script>